import { withRouter } from 'react-router';
import { Component } from 'refast';
import * as logic from './logic';
import './PageYcgd.less';
import Grid from 'uxcore-grid';
import {Row, Col} from 'uxcore-grid';
import Table from 'uxcore-table';
import ReactEcharts from 'echarts-for-react';

class PageYcgd extends Component {

  constructor(props) {
    super(props, logic);
    this.okModal = this.okModal.bind(this);
    this.hideModal = this.hideModal.bind(this);
  }

  onMxClick(rowData, lx) {
  }

  okModal() {
  }

  hideModal() {
  }

  componentWillMount() {
  }

  componentDidMount() {
    this.dispatch('edata', this.props.params);
    // this.dispatch('pm10Qx', {size: 20, ...this.props.params});
  }

  shouldComponentUpdate(nextProps, nextState) {
    const thisProps = this.props || {},
      thisState = this.state || {};
    if (Object.keys(thisProps).length !== Object.keys(nextProps).length ||
      Object.keys(thisState).length !== Object.keys(nextState).length) {
      return true;
    }

    for (const key in nextProps) {
      if (thisProps[key] !== nextProps[key]) {
        return true;
      }
    }

    for (const key in nextState) {
      if (thisState[key] !== nextState[key]) {
        return true;
      }
    }
    return false;
  }

  render() {

    return (
      <div className="page-ycgd">
        <Grid fluid={true}>
          <Row className="show-grid">
            <Col xs={24} md={24}>
              <div className="col_1" style={{height: this.state.layout.mHeight}}>
                <div className="title title_1">工地设备列表</div>
                <div style={{height: this.state.layout.mHeight - 35}}>
                  <Table height={this.state.layout.mHeight - 35} ref="ycsblbTable" {...this.state.ycsblbOption}/>
                </div>
              </div>
            </Col>
          </Row>
          <Row className="show-grid">
            <Col xs={24} md={24}>
              <div className="col_1" style={{height: this.state.layout.mHeight}}>
                <div className="title title_2">PM10变化曲线图（最近20次数据）</div>
                <div>
                  <ReactEcharts
                    option={this.state.ycsbpmOption}
                  />
                </div>
              </div>
            </Col>
          </Row>
        </Grid>
      </div>
    );
  }
}

export default withRouter(PageYcgd);
